import React from "react";
import {Button, message} from "antd";
import {ExportOutlined} from "@ant-design/icons";
import * as XLSX from "xlsx";

interface DataType {
  key: React.Key;
  main: string;
  number: string;
  name: string;
  attribute: string;
  location: string;
  address: string;
  ownership: string;
  isImportant: boolean;
  note: string;
  editStatus?: boolean;
}

interface ExcelExportProps {
  data: DataType[];
}

/*
    XLSX.utils.book_new()创建新文件
    XLSX.utils.aoa_to_sheet 新sheet表
    merges数组表示对行和列进行合并，c表示column(列)，r表示row(行)，s表示start(开始)，e表示end(结束)，索引从0开始
 */

const ExcelExport: React.FC<ExcelExportProps> = ({data}) => {
  const handleExport = () => {
    // 自定义表头
    const customHeaders = [
      "序号",
      "主体",
      "仓库编号",
      "仓库名称",
      "仓库属性",
      "仓库位置",
      "仓库地址",
      "仓库权属",
      "是否重要仓库",
      "其他备注",
    ];

    // 将自定义表头和数据合并为一个二维数组
    const dataArray = [
      customHeaders,
      // 将 data 数组映射后的结果作为一个新的子数组插入到 dataArray, map()方法会遍历 data 数组中的每一个 item
      ...data.map((item) => [
        item.key,
        item.main,
        item.number,
        item.name,
        item.attribute,
        item.location,
        item.address,
        item.ownership,
        item.isImportant ? "是" : "否",
        item.note,
      ]),
    ];

    // 创建工作簿
    const workbook = XLSX.utils.book_new();

    // 创建工作表，将数据写入第一张表
    const sheet = XLSX.utils.aoa_to_sheet(dataArray);

    // 将工作表添加到工作簿
    XLSX.utils.book_append_sheet(workbook, sheet, "Sheet1");

    // 将工作簿写入文件并下载
    XLSX.writeFile(workbook, "table_data.xlsx");
    message.success("导出成功");
  };

  return (
    <Button type="primary" icon={<ExportOutlined/>} onClick={handleExport}>
      Excel导出
    </Button>
  );
};

export default ExcelExport;
